import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  ScrollView,
  Image,
  Animated,
  TouchableOpacity
} from 'react-native';
import styles from './settingIndexStyle';

import EasemobChat from '../global/EasemobChat';
import ToastTip from '../global/ToastTip';
import api from '../../services/api';

class SettingIndex extends Component {
    constructor(props) {
		super(props);

		this.state = {
            scrollY: new Animated.Value(0)
		};

		// this._getTabHeight = this._getTabHeight.bind(this);
		// this._onChangeTab = this._onChangeTab.bind(this);

		// this.props.navigator.setOnNavigatorEvent(this._onNavigatorEvent.bind(this));
	}

    componentWillMount() {
		// this._retrieveDetails();
	}

    _editPhone(){
        let {navigator} = this.props;
        navigator.push({
            title: "更改手机号",
            backButtonTitle:'',
			screen: 'housekeeperapp.settingphone',
			passProps: {
				// orderId
			},
            navigatorStyle:{
                navBarHidden: false,
                tabBarHidden: true,
                navBarTextColor: 'white',
            	navBarButtonColor: 'white',
            	navBarBackgroundColor: '#EA5404',
                statusBarColor: '#EA5404',
                navBarTitleTextCentered: true,
                topBarElevationShadowEnabled:false
            },
            navigatorButtons: {
                leftButtons:[
                    {
                        id: 'back',
                        icon: require("../../../img/hk_back_icon.png")
                    }
                ]
            }
            // navigatorButtons:{
            //     leftButtons:[{
            //         icon: require('../../../img/hk_back_icon.png'),
            //         id: 'back'
            //     }]
            // }
		});
    }

    _editPassword(){
        let {navigator} = this.props;
        navigator.push({
            title: "修改账户密码",
            backButtonTitle:'',
			screen: 'housekeeperapp.settingpassword',
			passProps: {
				// orderId
			},
            navigatorStyle:{
                navBarHidden: false,
                tabBarHidden: true,
                navBarTextColor: 'white',
            	navBarButtonColor: 'white',
            	navBarBackgroundColor: '#EA5404',
                statusBarColor: '#EA5404',
                navBarTitleTextCentered: true,
                topBarElevationShadowEnabled:false
            },
            navigatorButtons: {
                leftButtons:[
                    {
                        id: 'back',
                        icon: require("../../../img/hk_back_icon.png")
                    }
                ]
            }
		});
    }
    _editWithdrawPassword() {
        let {navigator} = this.props;
        navigator.push({
            title: "修改提现密码",
            backButtonTitle:'',
			screen: 'housekeeperapp.settingwithdrawpassword',
			passProps: {
				// orderId
			},
            navigatorStyle:{
                navBarHidden: false,
                tabBarHidden: true,
                navBarTextColor: 'white',
            	navBarButtonColor: 'white',
            	navBarBackgroundColor: '#EA5404',
                statusBarColor: '#EA5404',
                navBarTitleTextCentered: true,
                topBarElevationShadowEnabled:false
            },
            navigatorButtons: {
                leftButtons:[
                    {
                        id: 'back',
                        icon: require("../../../img/hk_back_icon.png")
                    }
                ]
            }
		});
    }

    async _submitAction(){
        let { session } = this.props;
        let user_role = session && session.user.role;
        if(user_role == 1 || (user_role == 0 && session.user.easemob_kefu_name && session.user.easemob_kefu_pwd)){
            EasemobChat.chatLogout(async (resStr)=>{
                if(resStr == 'success'){
                    await api.post("/housekeeper/logout",{phone: session.user.phone});
                    let {actions, dispatch} = this.props;
                    dispatch(actions.session.clear_session());
                }else{
                    this.refs.toast.show("退出失败");
                }
            });
        }else{
            await api.post("/housekeeper/logout",{phone: session.user.phone});
            let {actions, dispatch} = this.props;
            dispatch(actions.session.clear_session());
        }
    }

    render() {
        let { session } = this.props;
        if(!session){
            return null;
        }

        let withdraw_password = session.user && session.user.withdraw_password;

        return (
            <View style={styles.container}>
                <ScrollView
                    style={styles.scrollContainer}
                    scrollEventThrottle={16}>

                    <View style={styles.toolsContainer}>
                        <View style={[styles.addBtn,{paddingTop: 15,paddingBottom:15, height: 'auto'}]}>
                            <Text style={styles.headText}>{session.user.keeper_name}</Text>
                        </View>

                        <View onPress={null} style={styles.addBtn}>
                            <Text style={[styles.addText,{marginLeft:0}]}>已绑定手机号</Text>
                            <Text style={[styles.rightImage,{color:"#555555",fontSize:15,marginRight:10}]}>{session.user.phone}</Text>
                        </View>

                        <TouchableOpacity onPress={this._editPassword.bind(this)} style={[styles.addBtn,withdraw_password ? {} : {borderBottomWidth:0}]}>
                            <Text style={[styles.addText,{marginLeft:0}]}>修改账户密码</Text>
                            <Text style={[styles.rightImage,{color:"#B5B5B5",fontSize:15,marginRight:10}]}>修改</Text>
                            <Image source={require('../../../img/hk_arrow_icon.png')} style={styles.rightImage}/>
                        </TouchableOpacity>
                        {
                            withdraw_password ? <TouchableOpacity onPress={this._editWithdrawPassword.bind(this)} style={[styles.addBtn,{borderBottomWidth:0}]}>
                                <Text style={[styles.addText,{marginLeft:0}]}>修改提现密码</Text>
                                <Text style={[styles.rightImage,{color:"#B5B5B5",fontSize:15,marginRight:10}]}>修改</Text>
                                <Image source={require('../../../img/hk_arrow_icon.png')} style={styles.rightImage}/>
                            </TouchableOpacity> : null
                        }

                    </View>

                    <TouchableOpacity onPress={this._submitAction.bind(this)} style={styles.submitActionPhoneBtn}>
                        <Text style={styles.submitActionText}>退出登录</Text>
                    </TouchableOpacity>
                </ScrollView>
                <ToastTip ref="toast"/>
            </View>
        );
    }
}

var connectHelper = require('../../services/connectHelper');
SettingIndex = connectHelper(state => state)(SettingIndex);

module.exports = SettingIndex;
